<!doctype html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <title>回执-司法所</title>
    <link href="/static/css/main-page/g-reset.css" rel="stylesheet" type="text/css" />
    <script src="/webjars/miniui/boot.js" type="text/javascript"></script>
    <script src="/static/js/common/common.js" type="text/javascript"></script>
    <style>
        body {
            height:100%;
        }
        td.discell {
            text-align:right;
            width:100px;
        }
        .dialog-box {
            padding:10px 20px;
            overflow:hidden;
        }
        .dialog-box > li {
            width:80%;
            float:left;
            margin:5px 0;
        }
        .dialog-box > li.currentUser-wrap {
            float:right;
        }
        .dialog-box > li > div {
            position:relative;
        }
        .dialog-box > li.currentUser-wrap > div {
            text-align:right;
        }
        .send-time {
            font-size:12px;
            line-height:18px;
            color:#919191;
            padding:0 10px;
        }
        .dialog-box > li > ul {
            float:left;
            background:#DCDFE6;
            color:#000;
            position:relative;
            padding:10px;
            max-width:380px;
            -webkit-border-radius:5px;
            -moz-border-radius:5px;
            border-radius:5px;
        }
        .dialog-box > li.currentUser-wrap > ul {
            float:right;
            background:#4A89FD;
            color:#fff;
            position:relative;
        }
        .dialog-box > li > ul:before {
            content:"";
            position:absolute;
            top:10px;
            left:-10px;
            height:0;
            width:0;
            border:5px solid #DCDFE6;
            border-left-color:transparent;
            border-top-color:transparent;
            border-bottom-color:transparent;
        }
        .dialog-box > li.currentUser-wrap > ul:before {
            content:"";
            position:absolute;
            top:10px;
            left:100%;
            height:0;
            width:0;
            border:5px solid #4A89FD;
            border-right-color:transparent;
            border-top-color:transparent;
            border-bottom-color:transparent;
        }
    </style>
</head>
<body>
<form id="form1" method="post" style="height:100%;width: 100%;overflow-x: auto;overflow-y: auto;">
    <!-- 用户 编辑框START-->
    <div id="editform" class="form mini-fit" style="margin-bottom: 88px;overflow-y: auto;">
        <#--唯一标识id-->
        <input name="id" id="id" class="mini-hidden" style="width: 100%;" value="${id!''}" readonly />
        <#--罪犯编号-->
        <input name="priNum" id="priNum" class="mini-hidden" style="width: 100%" value="${priNum!''}" readonly />
        <ul class="dialog-box">
        </ul>

    </div>
    <div style="position: absolute;bottom:0;width:100%;height: 88px;border-top:1px solid #dfdfdf;text-align: center">
        <table style="height: 100%;width:100%">
            <tr>
                <td class="discell"><font color="#dc143c">*</font>司法所联系人：</td>
                <td class="input">
                    <input width="100%" class="mini-textbox" required="true" emptyText="请输入..." id="Receiver" name="Receiver"
                           value="${startCheckPerson}" />
                </td>
                <td class="discell"><font color="#dc143c">*</font>联系电话：</td>
                <td>
                    <input width="100%" class="mini-textbox" required="true" emptyText="请输入手机号码或固定电话..." id="ReceiverTel" name="ReceiverTel"
                           onblur="checkPhone(ReceiverTel)" value="${startCheckPhone}" />
                </td>
                <td align="center" width="120" rowspan="2">
                    <a style="margin-bottom: 10px;" class="mini-button" iconCls="fa-save" onclick="sendMessage()">发送</a>
                    <a class="mini-button" iconCls="fa-refresh" onclick="getDialogList()">刷新</a>
                </td>
            </tr>
            <tr>
                <#if "${localCode!''}" == "140000">
                    <td class="discell">备注：</td>
                    <td colspan="3">
                        <input width="100%" class="mini-textarea" emptyText="请输入..." id="message" name="message" />
                    </td>
                <#else>
                    <td class="discell"><font color="#dc143c">*</font>内容：</td>
                    <td colspan="3">
                        <input width="100%" class="mini-textarea" required="true" emptyText="请输入..." id="message" name="message" />
                    </td>
                </#if>

                <input id="fhfs" name="fhfs" class="mini-hidden" value="${fhfs}"/>
            </tr>
        </table>
    </div>
</form>

<script type="text/javascript">
    mini.parse();
    var form = new mini.Form("form1");
    var priNum = $('#priNum').val();

    function sendMessage() {
        var Receiver = mini.get('Receiver');
        var ReceiverTel = mini.get('ReceiverTel');
        var msg = mini.get('message');
        // 验证表单必填项
        form.validate();
        if (form.isValid() == false) {
            return;
        }
        if (!checkPhone(ReceiverTel)) {
            return;
        }
        // 获取输入框的值
        var liaisonMan = Receiver.getValue();
        var liaisonPhone = ReceiverTel.getValue();
        var message = msg.getValue();
        if("${localCode!''}" == "140000"){
            var sendMessage = '<li class="currentUser-wrap">\n' +
                '                <div>司法所</div>\n' +
                '                <ul>\n' +
                '                    <li>联系人：' + liaisonMan + '</li>\n' +
                '                    <li>联系电话：' + liaisonPhone + '</li>\n' +
                '                    <li>备注：' + message + '</li>\n' +
                '                </ul>\n' +
                '            </li>';
        } else{
            // 对话框中追加对话信息
            var sendMessage = '<li class="currentUser-wrap">\n' +
                '                <div>司法所</div>\n' +
                '                <ul>\n' +
                '                    <li>联系人：' + liaisonMan + '</li>\n' +
                '                    <li>联系电话：' + liaisonPhone + '</li>\n' +
                '                    <li>内容：' + message + '</li>\n' +
                '                </ul>\n' +
                '            </li>';
        }
        $('.dialog-box').append(sendMessage);
        $("#editform").scrollTop($("#editform")[0].scrollHeight);

        var postData = {priNum: priNum, liaisonMan: liaisonMan, liaisonPhone: liaisonPhone, takebackTime: "", takebackAddress: "", message: message};
        postData = mini.encode(postData);
        $.ajax({
            url: '/azbj/yazgl/xj/hz/savemessage',
            type: 'POST',
            datatype: 'json',
            data: {data: postData},
            success: function (data) {
                Receiver.setValue(data.data.userDTO.username);
                ReceiverTel.setValue(data.data.userDTO.phone);
                msg.setValue();
                // 发送成功后获取所有对话记录
                getDialogList();
            },
            error: function (status) {
                mini.alert("发送异常")
            }
        })
    }

    function getDialogList() {
        var dialogStr = '';
        var fhfs = mini.get("fhfs").getValue();
        $.ajax({
            url: '/azbj/xj/hz/listMessages?priNum=' + priNum,
            type: 'GET',
            datatype: 'json',
            success: function (data) {
                data = JSON.parse(data);
                if (data.length) {
                    for (var i = 0, len = data.length; i < len; i++) {
                        if (1 == data[i].ownerFlag) {
                            if (fhfs === '监狱送回') {
                                dialogStr += '<li>';
                                dialogStr += '<div>' + data[i].sendName + '<span class="send-time">' + data[i].createTime + '</span></div>';
                                dialogStr += '<ul>';
                                dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                                dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                                dialogStr += '<li>接回时间：' + data[i].takebackTime + '</li>';
                                dialogStr += '<li>接回地点：' + data[i].takebackAddress + '</li>';
                                dialogStr += '</ul>';
                                dialogStr += '</li>';
                            }else if (fhfs === '人员自返') {
                                dialogStr += '<li>';
                                dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].sendName + '</div>';
                                dialogStr += '<ul>';
                                dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                                dialogStr += '<li>监所手机号码：' + data[i].liaisonPhone + '</li>';
                                dialogStr += '<li>监所固话：' + data[i].liaisonTel + '</li>';
                                dialogStr += '<li>返回时间：' + data[i].takebackTime + '</li>';
                                dialogStr += '<li>返回地点：' + data[i].takebackAddress + '</li>';
                                dialogStr += '</ul>';
                                dialogStr += '</li>';
                            }else {
                                dialogStr += '<li>';
                                dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].sendName + '</div>';
                                dialogStr += '<ul>';
                                dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                                dialogStr += '<li>监所手机号码：' + data[i].liaisonPhone + '</li>';
                                dialogStr += '<li>监所固话：' + data[i].liaisonTel + '</li>';
                                dialogStr += '<li>接回时间：' + data[i].takebackTime + '</li>';
                                dialogStr += '<li>接回地点：' + data[i].takebackAddress + '</li>';
                                dialogStr += '</ul>';
                                dialogStr += '</li>';
                            }
                        } else if (3 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div>' + data[i].sendName + '<span class="send-time">' + data[i].createTime + '</span></div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>接回时间：' + data[i].takebackTime + '</li>';
                            dialogStr += '<li>备注：' + ((data[i].takebackAddress === null) ? "" : data[i].takebackAddress) + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (5 == data[i].ownerFlag) {
                            dialogStr += '<li>';
                            dialogStr += '<div>' + data[i].sendName + '<span class="send-time">' + data[i].createTime + '</span></div>';
                            dialogStr += '<ul>';
                            dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                            dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                            dialogStr += '<li>接回时间：' + data[i].takebackTime + '</li>';
                            dialogStr += '<li>备注：' + ((data[i].takebackAddress === null) ? "" : data[i].takebackAddress) + '</li>';
                            dialogStr += '</ul>';
                            dialogStr += '</li>';
                        } else if (2 == data[i].ownerFlag) {
                            if("${localCode!''}" == "140000"){
                                if(null == data[i].message) {
                                    data[i].message="";
                                }
                                dialogStr += '<li class="currentUser-wrap">';
                                dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].name + '司法所</div>';
                                dialogStr += '<ul>';
                                dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                                dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                                dialogStr += '<li>备注：' + data[i].message + '</li>';
                                dialogStr += '</ul>';
                                dialogStr += '</li>';
                            } else {
                                dialogStr += '<li class="currentUser-wrap">';
                                dialogStr += '<div><span class="send-time">' + data[i].createTime + '</span>' + data[i].name + '司法所</div>';
                                dialogStr += '<ul>';
                                dialogStr += '<li>联系人：' + data[i].liaisonMan + '</li>';
                                dialogStr += '<li>联系电话：' + data[i].liaisonPhone + '</li>';
                                dialogStr += '<li>内容：' + data[i].message + '</li>';
                                dialogStr += '</ul>';
                                dialogStr += '</li>';
                            }

                        }
                    }
                } else {
                    dialogStr = "<div style='padding: 50px 0 0;text-align: center;font-size: 18px;'>暂无回执消息</div>"
                }

                $('.dialog-box').html(dialogStr);
                $("#editform").scrollTop($("#editform")[0].scrollHeight);
            }
        })
    }

    //电话号码的验证
    function checkPhone(tel) {
        var phone = mini.get(tel).getValue();
        if (/^1[3456789]\d{9}$/.test(phone) || /^0\d{2,3}-?\d{7,8}$/.test(phone)) {
            return true;
        } else {
            mini.alert("联系电话有误，请重填");
            return false;
        }
    }

    // 页面一加载
    $(function () {
        getDialogList()
    })
</script>
</body>
</html>